<template>
  <!-- 合并开票 -->
  <uni-popup ref="invoiceDialog">
    <uni-popup-dialog
        type="info"
        cancelText="取消"
        confirmText="确认"
        title="合并开具发票"
        @close="cancel"
        @confirm="submitForm"
        before-close>
      <template v-slot="content">
        <uni-notice-bar
            single color="#00a660"
            background-color="#e6f6ef"
            :text="' 开票总金额：' + amount + '元；开票订单：' + ids.length+ '笔'"
        />
        <uni-forms
            ref="form"
            :modelValue="form"
            :rules="rules"
            :label-width="90" type="line" label-align="left"
            class="paddingAll">
          <uni-forms-item label="发票抬头">
            <uni-easyinput v-model="form.title" disabled/>
          </uni-forms-item>
          <uni-forms-item label="纳税人识别号">
            <uni-easyinput v-model="form.taxpayerNumber" disabled/>
          </uni-forms-item>
          <uni-forms-item label="开票类型">
            <template v-for="(item, index) in dicts.ec_invoice_type">
              <template v-if="form.type == item.value">
                <uni-easyinput v-model="item.text" disabled/>
              </template>
            </template>
          </uni-forms-item>
          <uni-forms-item label="发票接收邮箱" name="email" required>
            <uni-easyinput placeholder="请输入发票接收邮箱" v-model="form.email" maxlength="100"/>
          </uni-forms-item>
          <uni-forms-item label="添加备注" name="remark">
            <uni-easyinput
                placeholder="非实际开票上的备注内容，最多200字！"
                rows="5"
                type="textarea"
                maxlength="200"
                v-model="form.remark"/>
          </uni-forms-item>
        </uni-forms>
      </template>
    </uni-popup-dialog>
  </uni-popup>
</template>

<script>

import {getDictsByNameForUni} from "@/utils/dicts";
import {addInvoiceOrder} from "@/api/ec/console/fee/invoiceOrder";

export default {
  props: {},
  data() {
    return {
      // 数据字典
      dicts: {
        // 开票类型
        ec_invoice_type: [],
      },
      // 用户信息
      userInfo: this.$store.getters.staffInfo,
      // 选中订单ids
      ids: [],
      // 开票合并金额
      amount: 0.00,
      // 表单
      form: {},
      // 表单校验
      rules: {
        email: {
          rules: [
            {required: true, errorMessage: '请输入发票接收邮箱'},
          ]
        },
      },
    };
  },
  created() {
    this.getDicts();
  },
  methods: {
    /**加载数据字典*/
    getDicts() {
      // 开票类型
      this.dicts.ec_invoice_type = getDictsByNameForUni("ec_invoice_type");
    },
    /** 打开弹出框 */
    toOpenDialog(ids, amount) {
      this.ids = ids;
      this.amount = amount;
      this.$refs.invoiceDialog.open('center')
      this.form = {
        title: this.userInfo.name,
        taxpayerNumber: this.userInfo.idNumberHide,
        type: 0,
        email: this.userInfo.email,
      };
    },
    /** 取消按钮 */
    cancel() {
      this.$refs.invoiceDialog.close()
    },
    /** 修改手机号码弹出框,确定按钮 */
    submitForm() {
      this.$refs.form.validate().then(valid => {
        if (valid) {
          this.$modal.loading();
          this.form.orderPayIds = this.ids.join();
          this.form.amount = this.amount;
          addInvoiceOrder(this.form).then(response => {
            uni.hideLoading()
            this.$emit('success', "");
            this.cancel();
          }).catch(() => {
            uni.hideLoading()
          });
        }
      });
    },
  }
};
</script>
<style scoped lang="scss">

::v-deep .uni-popup-dialog {
  width: 90%;
}

::v-deep .uni-dialog-content {
  padding: 26rpx;
  display: block;
}

.smscode_flex {
  display: flex;
  align-items: center;

  .code_btn {
    background: $uni-color-primary;
    color: #fff;
    padding: 4rpx 0;
    width: 170rpx;
    font-size: 26rpx;
    margin-left: 10rpx;
  }

  .code_graybtn {
    background: #cccccc;
    color: #fff;
    padding: 4rpx 0;
    width: 170rpx;
    font-size: 26rpx;
    margin-left: 10rpx;
  }
}

.sounds-text {
  margin-top: 3px;
  color: $uni-color-primary;
  text-align: right;
  font-size: 13px;
  cursor: pointer;
}
</style>
